# @v-uik

[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/)

Расширяемое, темизируемое и кастомизируемое решение для ваших проектов.

## Запуск витрины storybook

##### Установка зависимостей:

_Перед установкой лучше выполнить `git pull origin $BRANCH`, чтобы получить свежие изменения_

```bash
yarn install
```

##### Запуск витрины

```
`yarn run showroom`
```

При успешной сборке, в браузере, который установлен по-умолчанию, автоматически откроется вкладка с содержимым витрины, написанной с использованием `storybook`.

## Как использовать @v-uik/theme для компонентов

При разработке компонентов, в их стилях используются токены пакета `@v-uik/theme`, которые определяют форму, шрифт, цвет и тому подобное, проще говоря все то, что может настроить пользователь.

Дизайнеры также используют нашу систему токенов, так что придумывать, какой токен где использовать не придется, достаточно посмотреть макет.

Для определения токенов цвета необходимо использовать наборы `comp` (компонентный слой) и `sys` (системный слой). **Важно!!! Наборы цветовых токенов `colourway` и `color`, считаются устаревшими, и будут в скором времени удалены.**

## Тестирование

Каждый пакет покрывается необходимым, достаточным набором тестов, чтобы считать, что компонент работает правильно, как задумано дизайнерами и разработчиками. Для этого мы используем 2 типа тестов:

- unit-тесты для проверки свойств и состояний компонентов. Для написания данного типа тестов используется фреймворк [jest](https://jestjs.io/)
- e2e-тесты для проверки внешнего вида компонентов и сложных сценариев. Для написания данного типа тестов используется фреймворк [playwright](https://playwright.dev/)

Полный гайд по написанию и запуску тестов вы можете посмотреть в документе [TESTING.md](./TESTING.md).
